<!DOCTYPE html>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="contextPath" value="${pageContext.request.contextPath}" />
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>添加用户</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<meta content="width=device-width, initial-scale=1" name="viewport">
<link rel="stylesheet" type="text/css" href="${contextPath}/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="${contextPath}/css/bootstrap-theme.min.css" />
<link href="${contextPath}/css/jquery-ui.min.css" rel="stylesheet">
<link href="${contextPath}/css/jquery-ui.theme.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="${contextPath}/css/public.css">
<script type="text/javascript" src="${contextPath}/js/jquery.min.js"></script>
<script type="text/javascript" src="${contextPath}/js/bootstrap.min.js"></script>

<script type="text/javascript" src="${contextPath}/js/common.js"></script>
<script type="text/javascript" src="${contextPath}/js/jquery.ui.core.js"></script>
<script type="text/javascript" src="${contextPath}/js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="${contextPath}/js/jquery.ui.datepicker.js"></script>
<script type="text/javascript" src="${contextPath}/js/jquery.ui.datepicker-ch.js"></script>
<style type="text/css">
#delbutton{
	display: block;
    border: #222222 4px solid;
    position: absolute;
    width: 60px;
    height: 60px;
    background: white;
    text-align: center;
    line-height: 50px;
    font-size: 30px;
    cursor: pointer;

}
</style>
<body>
	<div class="container">
		<div class="panel panel-default">
			<div class="panel-heading">
				更新<span class="pull-right text-success">管理员：${sessionScope.username} | <a href="${contextPath}/quit">退出</a> </span>
			</div>
			<div class="panel-body">
				<form action="${contextPath}/security/update" method="post" id="addMarriage" name="addMarriage" role="form" class="form-horizontal">
					<div class="form-group">
						<label for="marriageId" class="col-sm-2 control-label">证字号：</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" name="marriageId" id="marriageId" value="${item.marriageId}" placeholder="证字号" autocomplete="off"> <span class="help-block"></span>
						</div>
						<label for="marriageDate" class="col-sm-2 control-label">登记日期：</label>
						<div class="col-sm-10">
							<input class="form-control" id=marriageDate name="marriageDate" type="text" value="${item.marriageDate}" placeholder="日期" autocomplete="off"><span class="help-block"></span>
						</div>
					</div>
					<div class="form-group">
						<label for="manName" class="col-sm-2 control-label">男方姓名：</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" name="manName" id="manName" value="${item.manName}" placeholder="男方姓名" autocomplete="off"> <span class="help-block"></span>
						</div>
						<label for="manId" class="col-sm-2 control-label">男方身份证号：</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" name="manId" id="manId" value="${item.manId}" placeholder="男方身份证号" autocomplete="off"> <span class="help-block"></span>
						</div>
					</div>

					<div class="form-group">
						<label for="womanName" class="col-sm-2 control-label">女方姓名：</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" name="womanName" id="womanName" value="${item.womanName}" placeholder="女方姓名" autocomplete="off"> <span class="help-block"></span>
						</div>
						<label for="womanId" class="col-sm-2 control-label">女方身份证号：</label>
						<div class="col-sm-10">
							<input type="text" class="form-control" name="womanId" id="womanId" value="${item.womanId}" placeholder="女方身份证号" autocomplete="off"> <span class="help-block"></span>
						</div>
					</div>
					<div class="form-group">
						<label for=marriageStatus class="col-sm-2 control-label">登记业务：</label>
						<div class="col-sm-10">
							<select class="form-control" id="marriageStatus" name="marriageStatus" autocomplete="off">
								<option value="结婚" <c:if test="${item.marriageStatus eq '结婚'}"> selected="selected" </c:if>>结婚</option>
								<option value="离婚" <c:if test="${item.marriageStatus eq '离婚'}"> selected="selected" </c:if>>离婚</option>
								<option value="补领结婚" <c:if test="${item.marriageStatus eq '补领结婚'}"> selected="selected" </c:if>>补领结婚</option>
								<option value="补领离婚" <c:if test="${item.marriageStatus eq '补领离婚'}"> selected="selected" </c:if>>补领离婚</option>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label for="womanId" class="col-sm-2 control-label">档案图片：</label>
						<div class="col-sm-10" style="margin-top: 6px;">
							<a href="javascript:getImage(${item.id});">点击查看档案<span id="imageCountShow">[${item.imageCount}]</span></a>
							<div id="imgs">
							<c:forEach items="${item.imageList}" var="item1">
								<div id="delbutton" title="删除" onclick="delImg('${item1}');" >X</div><img width="100%" src="${contextPath}/${item1}" />
							</c:forEach>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="col-sm-offset-2 col-sm-10">
							<button type="button" class="btn btn-success" id="update">更新</button>
							<button type="button" class="btn btn-danger" id="del">清空图片</button>
							<button type="button" class="btn btn-primary" id="close">关闭</button>
							<input id="message" value="${message}" type="hidden" /> <input id="id" name="id" value="${item.id}" type="hidden" />
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	
	<script type="text/javascript">
		$(document).ready(function() {
			$("#marriageDate").datepicker();
			$.datepicker.regional["ch"];
			var msg = $("#message").val();
			if (msg != '') {
				alert(msg);
			}
			$("#update").click(function() {
				addMarriage.submit();
			});
			$("#close").click(function() {
				window.close();
			});
			$("#del").click(function() {
				$("#myModal").modal('show');
			});
		});
		var getImage = function(userId) {
			var url = "${contextPath}/security/getImage?userId=" + userId;
			window.open(url, "_blank");
		};
		var delImage = function(userId) {
			$.ajax({
				type : 'POST',
				data : {"userId" : userId},
				url : '${contextPath}/security/delImage',
				dataType : 'json',
				success : function(data) {
					$("#myModal").modal('hide');
					$("#imageCountShow").html("[0]");
					alert(data.message);
					location.reload();
				}
			})
		};
		var delImg = function(path){
			$.ajax({
				type : 'POST',
				data : {"path" : path},
				url : '${contextPath}/security/delImg',
				dataType : 'json',
				success : function(data) {
					//$("#myModal").modal('hide');
					//$("#imageCountShow").html("[0]");
					alert(data.message);
					location.reload();
				}
			});
		};
	</script>
	
	
	<!-- 删除模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title">重要提示</h4>
				</div>
				<div class="modal-body">确定要删除该条数据？</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="deleteButton" onclick="delImage(${item.id});">删除</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
	</div>
	
</body>
</html>

